<template>
	<view class="template">
		<view class="con_auto">
			<u--form labelPosition="left" :model="dataForm" :rules="rules" ref="uForm">
				<u-form-item label="标题" prop="title" borderBottom ref="item1">
					<u--input v-model="dataForm.title" border="none" placeholder="请输入模板标题"></u--input>
				</u-form-item>
				<u-form-item
					label="类型"
					prop="type"
					borderBottom
					@click="
						showType = true;
						hideKeyboard();
					"
					ref="item1"
				>
					<u--input v-model="dataForm.typeName" disabled disabledColor="#ffffff" placeholder="请选择类型" border="none"></u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
				<u-form-item label="内容" prop="title" borderBottom ref="item1">
					<u--textarea v-model="dataForm.content" placeholder="请输入内容" maxlength="-1" autoHeight></u--textarea>
					<view class="flex-row flex-btn">
						<u-button size="mini" type="primary" text="姓名" @tap.stop="addContentInfo('relname')"></u-button>
						<u-button size="mini" type="primary" text="产品名" @tap.stop="addContentInfo('shop_name')"></u-button>
						<u-button size="mini" type="primary" text="时间转换" @tap.stop="addContentInfo('auto_time')"></u-button>
					</view>
				</u-form-item>
				<view class="submit">
					<u-button text="提交" type="primary" @click="submit"></u-button>
				</view>
			</u--form>
		</view>
		<u-picker :show="showType" :columns="[typeName]" keyName="title" @cancel="showType = false" @confirm="confirmType"></u-picker>
	</view>
</template>

<script>
export default {
	data() {
		return {
			rules: {},
			dataForm: {
				title: '',
				type: '',
				typeName: '',
				content: ''
			},
			typeName: [],
			showType: false,
			cursorPosition: -1
		};
	},
	onLoad() {
		this.getType();
	},
	methods: {
		hideKeyboard() {
			uni.hideKeyboard();
		},
		getType() {
			let _this = this;
			_this.$http('message_template/getTemplateByType').then((res) => {
				if (res.code) {
					this.typeName = res.data;
				}
			});
		},
		confirmType({ indexs, value, values }) {
			let item = value[0];
			this.dataForm.type = item.id;
			this.dataForm.typeName = item.title;
			this.showType = false;
		},
		addContentInfo(newText) {
			this.dataForm.content += '{'+newText+'}'
		},
		blur(cursor) {
			console.log(cursor)
			// this.cursorPosition = event.target.selectionStart; // 更新光标位置
		},
		submit(){
			let _this = this
			_this.$http('message_template/setTemplateByMember',{
				..._this.dataForm
			}).then(res=>{
				if(res.code){
					_this.$u.toast('添加成功')
					uni.navigateBack()
				}
			})
		}
	}
};
</script>

<style lang="scss" scoped>
.template {
	background: #fff;
}
.flex-btn {
	margin-top: 10rpx;
}
.submit {
	margin-top: 24rpx;
	padding-bottom: 24rpx;
}
</style>
